<style>
#s{
  border-bottom-style:solid;
  border-width:1px;
  border-bottom-color: #939598;
  font-size: 15px;
  padding-top: 20px;
  padding-left: 22px;
  padding-bottom: 20px;
}
#s1{

  background: #2361bf;
  padding-left:5px;
  margin-right: 30px;

}
#a1{
  margin: auto;
  margin-top: 20px;
  border-radius:5px;
  width: 1200px;
  height: 560px;
  background: #FFFFFF;
}

#a2{
  margin: auto;
  margin-top: 250px;
  border-radius:5px;
  width: 1200px;
  height: 100px;
  background: #FFFFFF;
}

.a2{
  float:right;
  padding: 40px;
}

.c{
  float: left;
  margin-left: 20px;
  text-align: center;
}

.c1{
  width: 330px;
  height: 45px;
}



</style>

<template>
  <div>
  <div id="a1">
    <p id="s"><span id="s1"></span>基本信息</p>
      <el-form ref="form" :model="form" label-width="80px">
        <div class="c">
          <el-form-item label="车主" class="c1">
          <el-input v-model="form.owner" placeholder="请输入车主" clearable ></el-input>
        </el-form-item>
        </div>


        <div class="c">
          <el-form-item label="车牌号" class="c1">
          <el-input v-model="form.plateNumber" placeholder="请输入车牌号" clearable></el-input>
        </el-form-item>
        </div>


        <div class="c">
          <el-form-item label="加油量" class="c1">
            <el-input v-model="form.fuelAmount" placeholder="请输入加油量" clearable></el-input>
          </el-form-item>
        </div>

      <div class="c">
        <el-form-item label="油费(元) " class="c1">
          <el-input v-model="form.mailFee" placeholder="请输入油费(元)" clearable></el-input>
        </el-form-item>
      </div>

        <div class="c">
          <el-form-item label="支付方式">
          <el-select v-model="form.paymentMethod" placeholder="请选择" class="c1" clearable>
            <el-option label="支付宝" value="1"></el-option>
            <el-option label="微信" value="2"></el-option>
            <el-option label="银联" value="3"></el-option>
            <el-option label="银行卡" value="4"></el-option>
          </el-select>
          </el-form-item>
        </div>

        <div class="c">
          <el-form-item label="备注">
          <el-input type="textarea" v-model="form.remark" placeholder="请输入内容" class="c1" clearable></el-input>
        </el-form-item>
        </div>

    </el-form>

  </div>

    <div id="a2">
      <div class="a2">
        <el-button @click="fan">取消</el-button>
        <el-button type="primary" @click="submitForm">保存</el-button>
      </div>
    </div>

  </div>
</template>

<script>
import {addMail, getMail} from "@/api/mail/mail";

  export default {
    data(){
      return{
        form:{}
      }
    },
    methods: {
      fan() {
        this.$router.push({path: "/mail"})
      },
        submitForm() {
          this.$refs["form"].validate(valid => {
            if (valid) {
              // if (this.form.id != null) {
              //   addMail(this.form).then(response => {
              //     this.$modal.msgSuccess("修改成功");
              //     this.$router.push({path: '/mail'})
              //   });
              // }
              addMail(this.form).then(response => {
                this.$modal.msgSuccess("成功");
                this.$router.push({path: "/mail"})
              })
            }
          });
        },
        findMail(){
          var id = this.$route.query.id;
          getMail(id).then(response => {
            this.form = response.data;
          });
        }

      },
    created() {
      if(this.$route.query.id){
        this.findMail();
      }else{
        console.log( this.$route.query.customerID+"....."+(this.$route.query.customerID!==undefined))
        if(this.$route.query.customerID!==undefined){
          this.findMail();
        }
      }


    }
    }

</script>
